//
//  SpacerPageView.swift
//  SwiftUIDemo
//
//  Created by zhouzuosong on 2020/8/18.
//  Copyright © 2020 Kael. All rights reserved.
//

import SwiftUI

struct SpacerPageView: View {
    var body: some View {
        VStack {
            Text("Spacer").font(.title)
            
            Text("均匀分布").font(.subheadline).padding()
            HStack{
                Text("item")
                    .padding()
                    .background(Color.yellow)
                
                Spacer()
                
                Text("item")
                    .padding()
                    .background(Color.yellow)
                
                Spacer()

                Text("item")
                    .padding()
                    .background(Color.yellow)
            }
            .padding()
            .background(Color.gray)
                        
            Text("最小宽度").font(.subheadline).padding()
            HStack(alignment: .top){
                Text("设置最小宽度可能会被挤压item")
                    .padding()
                    .background(Color.yellow)
                
                Spacer(minLength: 60)
                
                Text("item")
                    .padding()
                    .background(Color.yellow)
                
                Spacer(minLength: 30)

                Text("item")
                    .padding()
                    .background(Color.yellow)
            }
            .padding()
            .background(Color.gray)
            
            Text("相对间距").font(.subheadline).padding()
            HStack(alignment: .top){
                VStack {
                    Spacer()
                        .frame(width:4, height: 30)
                        .background(Color.blue)
                    Text("相对间距Item1")
                        .padding()
                        .background(Color.yellow)
                    Spacer()
                        .frame(width:4, height: 40)
                        .background(Color.blue)
                    Spacer()
                        .frame(width:4, height: 40)
                        .background(Color.blue)
                        .padding()
                }
                
                
                Spacer(minLength: 60)
                
                VStack {
                    
                    Spacer()
                        .frame(width:4, height: 40)
                        .background(Color.blue)
                    Spacer()
                        .frame(width:4, height: 40)
                        .background(Color.blue)
                        .padding()
                    Text("相对间距Item2")
                        .padding()
                        .background(Color.yellow)
                    Spacer()
                        .frame(width:4, height: 30)
                        .background(Color.blue)
                    
                }
                
                Spacer(minLength: 30)

                VStack {
                    
                    Spacer()
                        .frame(width:4, height: 40)
                        .background(Color.blue)
                    Spacer()
                        .frame(width:4, height: 40)
                        .background(Color.blue)
                        .padding()
                    
                    Spacer()
                        .frame(width:4, height: 40)
                        .background(Color.blue)
                    
                    Text("相对间距Item2")
                        .padding()
                        .background(Color.yellow)
                        .padding(5)
                    
                }
            }
            .padding()
            .background(Color.gray)
            

        }
    }
}

struct SpacerPageView_Previews: PreviewProvider {
    static var previews: some View {
        SpacerPageView()
    }
}
